<template>
  <view class="big">
    <view class="hiatus" v-if="addressList == []">
      <view class="img">
        <image src="../../static/index/images/位置缺省页.png" mode=""></image>
        <text>您还没有添加收货地址</text>
      </view>
    </view>
    <view class="conent" v-else>
      <view class="con-top" v-for="(item, index) in addressList" :key="index" @click="xuanze(item)">
        <view class="left">
          <text>{{ item.province_name }}{{ item.city_name }}{{ item.area_name }}{{ item.address }}</text>
          <u-tag size="mini" v-show="item.is_default == 1" text="默认" type="warning" />
          <!--  -->
          <p>{{ item.consignee }} {{ item.phone }}</p>
        </view>

        <view class="right"><image src="../../static/index/images/修改@2x.png" mode="" @click.stop="edit(item.id)"></image></view>
      </view>
    </view>
    <view class="button" @click="getAddress"><text>添加收货地址</text></view>
    <!-- <view class="button1" @click="Recharge"><text>使用微信地址</text></view> -->
  </view>
</template>

<script>
import { address } from '@/api/api.js';
export default {
  data() {
    return {
      addressList: []
    };
  },
  mounted() {
    this.address();
  },
  methods: {
    // 点击选择地址后
    xuanze(item) {
      console.log(item);
      uni.setStorageSync('address_id', item.id);
      uni.navigateBack();
    },
    getAddress() {
      uni.navigateTo({
        url: '../address/add'
      });
    },
    edit(id) {
      uni.navigateTo({
        url: `../address/add?id=${id}`
      });
    },
    async address() {
      let res = await address();
      console.log(res);
      if (res.code == 1) {
        this.addressList = res.data;
      }
    }
    // Recharge(){
    // 	uni.chooseAddress({
    // 		success: res => {
    // 			this.jump('/pages/address/add', { addressData: res });
    // 		},
    // 		fail: err => {
    // 			console.log('%cuni.chooseAddress,调用失败', 'color:green;background:yellow');
    // 		}
    // 	});
    // }
  }
};
</script>

<style lang="scss" scoped>
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
.big {
  padding: 0 32rpx 50rpx;

  .hiatus {
    width: 100%;
    margin-top: 292rpx;
    text-align: center;
    .img {
      width: 100%;
      height: 486rpx;
      position: relative;
      image {
        width: 100%;
        height: 100%;
      }
      text {
        // width: 196rpx;
        height: 42rpx;
        font-size: 28rpx;
        font-family: Source Han Sans SC-Regular, Source Han Sans SC;
        font-weight: 400;
        color: #aaaaaa;
        line-height: 33rpx;
        position: absolute;
        top: 440rpx;
        left: 50%;
        transform: translate(-50%, 0);
      }
    }
  }
  .conent {
    .con-top {
      padding: 32rpx 0;
      width: 100%;
      height: 168rpx;
      border-bottom: 2rpx solid #eeeeee;
      display: flex;
      position: relative;
      .left {
        width: 80%;
        height: 100%;
        padding-top: 10rpx;
        text {
          font-size: 32rpx;
          font-family: Source Han Sans SC-Medium, Source Han Sans SC;
          font-weight: 500;
          color: #001b0a;
          line-height: 38rpx;
          margin-right: 10rpx;
        }
        p {
          font-size: 24rpx;
          font-family: Source Han Sans SC-Medium, Source Han Sans SC;
          font-weight: 500;
          color: #aaaaaa;
        }
      }
      .right {
        flex: 1;
        position: absolute;
        top: 62rpx;
        right: 0;
        image {
          width: 48rpx;
          height: 48rpx;
        }
      }
    }
    .con-top:last-child {
      border-bottom: 0;
    }
  }
  .button {
    width: 686rpx;
    height: 96rpx;
    background: #001b0a;
    border-radius: 52rpx 52rpx 52rpx 52rpx;
    font-size: 32rpx;
    font-family: Source Han Sans SC-Bold, Source Han Sans SC;
    font-weight: bold;
    color: #ffffff;
    line-height: 96rpx;
    text-align: center;
    margin-left: 50%;
    transform: translate(-50%, 0);
    margin-top: 142rpx;
  }
  .button1 {
    width: 686rpx;
    height: 96rpx;
    border-radius: 60rpx 60rpx 60rpx 60rpx;
    border: 2rpx solid #001b0a;
    font-size: 32rpx;
    font-family: Source Han Sans SC-Bold, Source Han Sans SC;
    font-weight: bold;
    color: #001b0a;
    line-height: 96rpx;
    text-align: center;
    margin-top: 22rpx;
  }
}
</style>
